<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <h1>AJAX封装_请求参数</h1>
    <input type="button" value="获取响应数据get" onclick="get_data()">
    <input type="button" value="获取响应数据post" onclick="get_data_post()">
    <script>
        function AJAX(options){
            let xhr = new XMLHttpRequest()

            let params = ''
            for(let key in options.data){
                value = options.data[key]
                params = params+key+'='+value+'&'
            }
            params = params.substring(0,params.length-1)
            if(options.type === 'get'){
                options.url = options.url + '?' + params
            }
            xhr.open(options.type,options.url)
            if(options.type === 'post'){
                xhr.send(params)
            }else{
                xhr.send()
            }
            xhr.onreadystatechange=() =>{
                if(xhr.readyState===4 && xhr.status ===200){
                    console.log(xhr.responseText)
                }
            }
        }

        function get_data(){
            AJAX({
                type:'get',
                url:'http://httpbin.org/get',
                data:{'name':'sxt','pwd':'123'}
            })
        }

        function get_data_post(){
            AJAX({
                type:'post',
                url:'http://httpbin.org/post',
                data:{'name':'sxt','pwd':'123'}
            })
        }

    </script>
</body>
</html>